<template>
  <div class="snow-page">
    <div class="snow-inner">
      <a-form ref="formRef" auto-label-width :model="formData.form">
        <a-row :gutter="16">
          <a-col :xs="24" :sm="24" :md="12" :lg="12" :xl="6" :xxl="6">
            <a-form-item field="year" label="监测年份" style="margin-left: 22px;">
              <a-year-picker  v-model="formData.form.year" placeholder="监测年份"/>
            </a-form-item>
          </a-col>

          <a-col :xs="24" :sm="24" :md="12" :lg="12" :xl="6" :xxl="6">
            <a-space class="search-btn">
              <a-button type="primary" @click="getCommonTableList">
                <template #icon>
                  <icon-search />
                </template>
                <template #default>查询</template>
              </a-button>
              <a-button @click="onReset">
                <template #icon>
                  <icon-refresh />
                </template>
                <template #default>重置</template>
              </a-button>

            </a-space>
          </a-col>
        </a-row>
      </a-form>
      <a-card class="margin-top" :bordered="false">
        <a-row align="center">
          <a-col :span="24">
            <a-tabs :type="type" :size="size">
              <a-tab-pane key="1" title="废水">
                <a-table row-key="key" size="small" :bordered="{
                  cell: true
                }" :scroll="{ x: '100%', y: '100%', minWidth: 1000 }" :loading="loading" :columns="columns" :data="data1"
                  :row-selection="rowSelection" v-model:selectedKeys="selectedKeys" :pagination="pagination"
                  @page-change="pageChange" @page-size-change="pageSizeChange">
                

                  <template #optional>
                    <a-space>
                      <a-button size="mini" type="primary">详情</a-button>
                      <a-button size="mini">修改</a-button>
                      <a-popconfirm content="确定删除这条数据吗?" type="warning">
                        <a-button size="mini" type="primary" status="danger">删除</a-button>
                      </a-popconfirm>
                    </a-space>
                  </template>
                </a-table>
              </a-tab-pane>
              <a-tab-pane key="2" title="废气">
                <a-table row-key="key" size="small" :bordered="{
                  cell: true
                }" :scroll="{ x: '100%', y: '100%', minWidth: 1000 }" :loading="loading" :columns="columns2" :data="data2"
                  :row-selection="rowSelection" v-model:selectedKeys="selectedKeys" :pagination="pagination"
                  @page-change="pageChange" @page-size-change="pageSizeChange">
                  <template #avatar="{ record }">
                    <a-avatar auto-fix-font-size :size="30" :style="{
                      backgroundColor: '#14a9f8'
                    }">
                      {{ record.avatar }}
                    </a-avatar>
                  </template>

                  <template #optional>
                    <a-space>
                      <a-button size="mini" type="primary">详情</a-button>
                      <a-button size="mini">修改</a-button>
                      <a-popconfirm content="确定删除这条数据吗?" type="warning">
                        <a-button size="mini" type="primary" status="danger">删除</a-button>
                      </a-popconfirm>
                    </a-space>
                  </template>
                </a-table>
              </a-tab-pane>

            </a-tabs>
          </a-col>
          <a-col :span="24"> </a-col>
        </a-row>
      </a-card>

    </div>
  </div>
</template>

<script setup lang="ts">
import { getCommonTableListAPI } from "@/api/modules/table/index";
import { List, FormData, RowSelection, Pagination } from "./config";
const formData = reactive({
  form: {
    name: "",
    phone: "",
    email: "",
    address: "",
    status: null,
    year:""
  },
  search: false
});
const type = ref("rounded");
const size = ref("medium");
const selectedKeys = ref<string[]>([]);
const rowSelection = reactive<RowSelection>({
  type: "checkbox",
  showCheckedAll: true,
  onlyCurrent: false
});
const pagination = ref<Pagination>({ showPageSize: true, showTotal: true, current: 1, pageSize: 10, total: 10 });
const pageChange = (page: number) => {
  pagination.value.current = page;
};
const pageSizeChange = (pageSize: number) => {
  pagination.value.pageSize = pageSize;
};
const columns = [
{
    title: "序号",
    width: 70,
    render: ({ rowIndex }: { rowIndex: number })  => {
      return rowIndex + 1
    }
  },
  {
    title: "企业名称",
    dataIndex: "name",
    width: 180
  },
  {
    title: "采样时间",
    dataIndex: "HL",
    align: "center"
  },
  {
    title: "监测点名称",
    dataIndex: "DM",
    width: 120
  },
  {
    title: "检查项目名称",
    dataIndex: "GMSJ",
    width: 140
  },
  {
    title: "实测浓度",
    dataIndex: ""
  },
  {
    title: "折算浓度",
    dataIndex: "COD",
    align: "center",
  
  },
  {
    title: "是否超标",
    dataIndex: "BOD"
  },
  {
    title: "超标倍数",
    dataIndex: ""
  },
  {
    title: "监测项目单位",
    dataIndex: "",
    width: 120
  },

  // {
  //   title: "操作",
  //   slotName: "optional",
  //   align: "center",
  //   fixed: "right",
  //   width: "200"
  // }
];

const formRef = ref();
const onReset = () => {
  formRef.value.resetFields();
  getCommonTableList();
};
const loading = ref<boolean>(false);
const data1 = ref([
{
          "name":"上海明信食品有限公司",
          "SZLB": "IV",
          "SZMB": "III",
          "YUE": 6,
          "HL": "2024-09-23",
          "SJ": {
            "nanos": 0,
            "time": 1750210800000,
            "minutes": 40,
            "seconds": 0,
            "hours": 9,
            "month": 5,
            "timezoneOffset": -480,
            "year": 125,
            "day": 3,
            "date": 18
          },
          "ISGK": "区考",
          "NIAN": 2025,
          "TP": 0.28,
          "DM": "生产废水、生活污水排放口001",
          "AD": 0.29,
          "QX": "崇明县",
          "WD": 31.5280104,
          "GMSJ": "五日生化需氧量",
          "COD": 18,
          "JD": 121.7538694,
          "RJY": 6.04,
          "BOD": "否",
          "DMDM": "140414092939"
        },
        {
          "name":"上海明信食品有限公司",
          "SZLB": "IV",
          "SZMB": "III",
          "YUE": 6,
          "HL": "2024-09-23",
          "SJ": {
            "nanos": 0,
            "time": 1749171600000,
            "minutes": 0,
            "seconds": 0,
            "hours": 9,
            "month": 5,
            "timezoneOffset": -480,
            "year": 125,
            "day": 5,
            "date": 6
          },
          "ISGK": "区考",
          "NIAN": 2025,
          "TP": 0.06,
          "DM": "生产废水、生活污水排放口001",
          "AD": 0.05,
          "QX": "崇明县",
          "WD": 31.3817298,
          "GMSJ": "氨氮(NH3-N)",
          "COD": 8,
          "JD": 121.7147194,
          "RJY": 7.36,
          "BOD": "否",
          "DMDM": "130321104330"
        },
        {
          "name":"上海明信食品有限公司",
          "SZLB": "IV",
          "SZMB": "III",
          "YUE": 6,
          "HL": "2024-09-23",
          "SJ": {
            "nanos": 0,
            "time": 1750207200000,
            "minutes": 40,
            "seconds": 0,
            "hours": 8,
            "month": 5,
            "timezoneOffset": -480,
            "year": 125,
            "day": 3,
            "date": 18
          },
          "ISGK": "区考",
          "NIAN": 2025,
          "TP": 0.06,
          "DM": "生产废水、生活污水排放口001",
          "AD": 0.04,
          "QX": "崇明县",
          "WD": 31.5306993,
          "GMSJ": "化学需氧量",
          "COD": 5,
          "JD": 121.8357107,
          "RJY": 6.27,
          "BOD": "否",
          "DMDM": "140414093116"
        },
        {
          "name":"上海明信食品有限公司",
          "SZLB": "IV",
          "SZMB": "III",
          "YUE": 6,
          "HL": "2024-09-23",
          "SJ": {
            "nanos": 0,
            "time": 1749175200000,
            "minutes": 0,
            "seconds": 0,
            "hours": 10,
            "month": 5,
            "timezoneOffset": -480,
            "year": 125,
            "day": 5,
            "date": 6
          },
          "ISGK": "区考",
          "NIAN": 2025,
          "TP": 0.08,
          "DM": "生产废水、生活污水排放口001",
          "AD": 0.29,
          "QX": "崇明县",
          "WD": 31.3446607,
          "GMSJ": "悬浮物",
          "COD": 21,
          "JD": 121.7738604,
          "RJY": 7.45,
          "BOD": "否",
          "DMDM": "130115143315"
        },
        {
          "name":"上海明信食品有限公司",
          "SZLB": "IV",
          "SZMB": "III",
          "YUE": 6,
          "HL": "2024-09-23",
          "SJ": {
            "nanos": 0,
            "time": 1749178200000,
            "minutes": 50,
            "seconds": 0,
            "hours": 10,
            "month": 5,
            "timezoneOffset": -480,
            "year": 125,
            "day": 5,
            "date": 6
          },
          "ISGK": "区考",
          "NIAN": 2025,
          "TP": 0.08,
          "DM": "生产废水、生活污水排放口001",
          "AD": 0.08,
          "QX": "崇明县",
          "WD": 31.8303993,
          "GMSJ": "总磷(以P计)",
          "COD": 11,
          "JD": 121.2911385,
          "RJY": 5.73,
          "BOD": "否",
          "DMDM": "310260155111"
        },
        {
          "name":"上海明信食品有限公司",
          "SZLB": "IV",
          "SZMB": "III",
          "YUE": 6,
          "HL": "2024-09-23",
          "SJ": {
            "nanos": 0,
            "time": 1748739600000,
            "minutes": 0,
            "seconds": 0,
            "hours": 9,
            "month": 5,
            "timezoneOffset": -480,
            "year": 125,
            "day": 0,
            "date": 1
          },
          "ISGK": "国考",
          "NIAN": 2025,
          "TP": 0.12,
          "DM": "生产废水、生活污水排放口001",
          "AD": 0.46,
          "QX": "崇明县",
          "WD": 31.7179298,
          "GMSJ": "总氮(以N计)",
          "COD": null,
          "JD": 121.5047,
          "RJY": 4,
          "BOD": "否",
          "DMDM": "310260155197"
        },
]);
const getCommonTableList = async () => {
  try {
    loading.value = true;
    // let res = await getCommonTableListAPI();
    // Object.assign(data, res.data.list);
    // pagination.value.total = res.data.total;
  } finally {
    loading.value = false;
  }
};
getCommonTableList();



const columns2 = [
{
    title: "序号",
    width: 70,
    render: ({ rowIndex }: { rowIndex: number })  => {
      return rowIndex + 1
    }
  },
  {
    title: "企业名称",
    dataIndex: "name",
    width: 160
  },
  {
    title: "采样时间",
    dataIndex: "HL",
    align: "center"
  },
  {
    title: "监测点名称",
    dataIndex: "DM",
    width: 120
  },
  {
    title: "检查项目名称",
    dataIndex: "GMSJ",
    width: 140
  },
  {
    title: "实测浓度",
    dataIndex: ""
  },
  {
    title: "折算浓度",
    dataIndex: "COD",
    align: "center",
  
  },
  {
    title: "是否超标",
    dataIndex: "BOD"
  },
  {
    title: "超标倍数",
    dataIndex: ""
  },
  {
    title: "监测项目单位",
    dataIndex: "",
    width: 120
  },

  // {
  //   title: "操作",
  //   slotName: "optional",
  //   align: "center",
  //   fixed: "right",
  //   width: "200"
  // }
];

const data2 = ref([
{
          "name":"上海申能崇明发电有限公司",
          "SZLB": "IV",
          "SZMB": "III",
          "YUE": 6,
          "HL": "2025-01-09",
          "SJ": {
            "nanos": 0,
            "time": 1750210800000,
            "minutes": 40,
            "seconds": 0,
            "hours": 9,
            "month": 5,
            "timezoneOffset": -480,
            "year": 125,
            "day": 3,
            "date": 18
          },
          "ISGK": "区考",
          "NIAN": 2025,
          "TP": 0.28,
          "DM": "L#启动锅炉燃烧烟气排放口003",
          "AD": 0.29,
          "QX": "崇明县",
          "WD": 31.5280104,
          "GMSJ": "氮氧化物",
          "COD": 18,
          "JD": 121.7538694,
          "RJY": 6.04,
          "BOD": "否",
          "DMDM": "140414092939"
        },
        {
          "name":"上海申能崇明发电有限公司",
          "SZLB": "II",
          "SZMB": "III",
          "YUE": 6,
          "HL": "2025-01-09",
          "SJ": {
            "nanos": 0,
            "time": 1749171600000,
            "minutes": 0,
            "seconds": 0,
            "hours": 9,
            "month": 5,
            "timezoneOffset": -480,
            "year": 125,
            "day": 5,
            "date": 6
          },
          "ISGK": "区考",
          "NIAN": 2025,
          "TP": 0.06,
          "DM": "L#启动锅炉燃烧烟气排放口004",
          "AD": 0.05,
          "QX": "崇明县",
          "WD": 31.3817298,
          "GMSJ": "氮氧化物",
          "COD": 8,
          "JD": 121.7147194,
          "RJY": 7.36,
          "BOD": "否",
          "DMDM": "130321104330"
        },
])
</script>

<style lang="scss" scoped>
.search-btn {
  margin-bottom: 20px;
}
</style>
